<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
    <style type="text/css">
        form {
            width: 100%;
            height: 700px;
            margin-top: 0px;
            background: #008B8B;
        }

        div {
            display: inline-block;
            padding-top: 80px;
            padding-right: 20px;

        }

        h2 {
            font-family: "微软雅黑";
            font-size: 40px;
            color: black;
        }

        #log {
            color: blue;
        }
    </style>
</head>
<body>

<center>
    <div>
        <h2>
            Hedy西点店欢迎您！
        </h2>
        <p>
            用户名:<input id="userName" type="text"/>
        </p>
        <p>
            密&emsp;码:<input id="passWord" type="password"/>
        </p>
        <p>
            <input type="submit" id="login" value="登录"/>
        </p>
        <p>
            还没有账号？<a href="register.html">立即注册</a>
        </p>
    </div>
</center>
<script src="../js/jquery-3.1.1.min.js"></script>
<script>
    $(function () {
        $("#login").on('click', login);
    })

    function login() {
        var userName = $("#userName").val();
        var passWord = $("#passWord").val();
        var data = {userName: userName, passWord: passWord};
        $.ajax({
            url: "../login",
            type: "post",
            dataType: "json",
            data: data,
            async: false,
            success: function (data) {
                if (data.code = 200) {
                    alert(data.msg)
                    window.location.href="../index"
                } else {
                    alert(data.msg)
                }
            },
        });
    }
</script>
</body>
</html>